<script setup lang="ts">
import { defineComponent, onMounted, ref } from 'vue'
import { getLittleNews, getAllNews, getNewsByNewsId } from "@/services/healthNews"
import type { HealthNews } from '@/types/healthnews';
// 获取页面参数
const query = defineProps<{
  newsId: string
}>()
// 定义数据
var healthNews = ref<HealthNews>();

// 页面加载时执行的方法
const onPageLoad = async () => {
  const res = await getNewsByNewsId(query.newsId);
  healthNews.value = res.data;
  console.log(res)
}


// 使用 onMounted 钩子函数触发 onPageLoad 方法
onMounted(onPageLoad)
</script>

<template>
  <!-- <view class="father"> -->
  <view class="title">
    {{ healthNews?.newsTitle }}
  </view>
  <view class="source">文字来源 : {{ healthNews?.newsSource }}</view>
  <!-- </view> -->
  <view class="content">

    <rich-text :nodes="healthNews?.newsContent"></rich-text>
    <view style="margin: 15px; padding-bottom: 20px;font-size: 13px;">(声明: 版权归原作者所有，如有侵权请与陈海滨联系删除! )</view>


  </view>
</template>

<style scoped lang="scss">
.title {
  font-size: 22px;
  font-weight: bold;
  color: #4a4a4a;
}

.source {
  font-size: 10px;
  color: grey;
  margin-top: 18px;
  margin-bottom: 19px;
}

.content {
  line-height: 25px;
  font-size: 18px;
  color: #666666;

  img {
    margin: 15px 0px;
  }
}
</style>